<template>
  <a-spin tip="加载中..." :spinning="isLoading" style="height: calc(100% - 44px)">
    <div class="app-container crm-container">
      <a-breadcrumb style="margin-bottom: 20px">
        <a-breadcrumb-item>react+js子应用</a-breadcrumb-item>
        <a-breadcrumb-item>{{ label }} UI?</a-breadcrumb-item>
      </a-breadcrumb>
      <micro-app
        name="react-js-app"
        url="http://localhost:3001"
        baseroute="/react-js-app"
        @mounted="microAppMounted"
      ></micro-app>
    </div>
  </a-spin>
</template>

<script setup>
import { ref } from 'vue';

const isLoading = ref(true);
const microAppMounted = () => {
  isLoading.value = false;
};


</script>

<style scoped lang="scss">
.crm-container {
  height: calc(100% - 40px);
}

.micro-app,
:deep(micro-app-body) {
  height: calc(100%);
}
</style>


